<template>
	<view>
		<view class="flex-y-center topbox">
			<image :src="info.user.avatar" class="flex-grow-0 img"></image>
			<view class="flex-grow-1 name">{{info.name}}</view>
		</view>
		<form @submit="submitForm">
			<view class="bottombox">
				<view class="flex-y-center list">
					<view class="name">姓名</view>
					<input placeholder="请输入姓名" class="flex-grow-1 ipt" name="name"/>
				</view>
				<view class="flex-y-center list">
					<view class="name">手机号码</view>
					<input placeholder="请输入手机号码" class="flex-grow-1 ipt" name="mobile" type="number" />
				</view>
				<button class="btn" form-type="submit">确认</button>
			</view>
		</form>
	</view>
</template>

<script>
	import {
		Agent
	} from '../../../apirequest/agent-model.js';
	var a = new Agent();
	export default {
		data() {
			return {
				pid:0,
				info:''
			}
		},
		onLoad(options) {
			this.pid = options.pid
			this._index();
		},
		methods: {
			_index(){
				var that = this;
				a.my_parent({id:this.pid},(res) => {
					if(res.code == 1){
						that.info = res.data
					}else{
						uni.showToast({
							title:'参数错误',
							icon:'none'
						})
						setTimeout(() => {
							uni.navigateBack({
								delta:1
							})
						},1000)
					}
				})
			},
			submitForm(e){
				var param = e.detail.value
				if(!param.name || param.name == ''){
					uni.showToast({
						title:'请输入姓名',
						icon:'none'
					})
					return false;
				}
				if(!param.mobile || param.mobile == ''){
					uni.showToast({
						title:'请输入联系电话',
						icon:'none'
					})
					return false;
				}
				param.pid = this.pid;
				a.apply(param,(res) => {
					uni.showToast({
						title:res.msg,
						icon:'none'
					})
					setTimeout(() => {
						uni.switchTab({
							url:"/pages/shop/user/user"
						})
					},1000)
				})
			},
		}
	}
</script>

<style>
	page {
		background: #eee;
		font-size: 0.85rem;
	}

	.topbox {
		background: #fff;
		margin-bottom: 20rpx;
		padding: 20rpx;
	}

	.topbox .img {
		width: 100rpx;
		height: 100rpx;
		border-radius: 50%;
		margin-right: 20rpx;
	}

	.bottombox {
		background: #fff;
		padding: 20rpx;
	}

	.bottombox .list {
		margin: 40rpx 0;
	}

	.bottombox .list .name {
		width: 135rpx;
	}

	.bottombox .list .ipt {
    border: 1px solid #eee;
    height: 64rpx;
    padding: 10rpx;
    border-radius: 11rpx;
	}
		.bottombox .btn{
			background: #FF4544;
			color: #fff;
			text-align: center;
			width: 60%;
			padding: 15rpx 0;
			border-radius: 10rpx;
			margin: 60rpx auto 20rpx;
		}
</style>
